<style lang="less">
    .teacher-detail{
        position: relative;
        .head-img{
            position: absolute;
            right: 140px;
            top: 0;
            display: inline-block;
            z-index: 10;
            cursor: pointer;
        }
    }
</style>
<template>
    <div>
        <ZkModalVue class="teacher-detail" :title="title" :size="'md'" :visible="visible" @cancel="handleCancel">
            <a-avatar class="head-img" v-viewer :size="130" shape="square" :src="info.headUrl"/>
            <desc-list :col="1">
                <desc-item term="教师账号" :labelCol="labelCol">{{ info.account }}</desc-item>
                <desc-item term="教师姓名" :labelCol="labelCol">{{ info.name }}</desc-item>
                <desc-item term="教师性别" :labelCol="labelCol">{{ info.sexStr }}</desc-item>
                <desc-item term="手机号码" :labelCol="labelCol">{{ info.phone }}</desc-item>
            </desc-list>
            <desc-list :col="2">
                <desc-item term="所在专业" :labelCol="labelCol1">{{ info.majorStr }}</desc-item>
                <desc-item term="教师状态" :labelCol="labelCol1">{{ info.statusStr }}</desc-item>
                <desc-item term="注册时间" :labelCol="labelCol1">{{ info.createdTimeStr }}</desc-item>
            </desc-list>
        </ZkModalVue>
    </div>
</template>
<script>
    import { DescList, DescItem, STable } from '@/appBase';
    import ZkModalVue from '@/appBase/ZkModal.vue';
    import { queryEduTeacherDetail } from '@/api/demo';
    import { formatTimeStr } from '@/appBase/utils';
    import { BaseStatusEnum } from '../common/enum/enum';

    export default {
        name: "DemoEdit",
        components: {
            DescList,
            DescItem,
            STable,
            ZkModalVue
        },
        data() {
            return {
                title: '教师查看',
                pageLoading: false,
                visible: false,
                labelCol: {
                    span: 4
                },
                labelCol1: {
                    span: 8
                },
                id: null,
                info: {
                    account: "",
                    collegeCode: "0",
                    headUrl: "",
                    id: 0,
                    introduction: "",
                    majorCode: "",
                    majorStr:"",
                    name: "",
                    password: "",
                    phone: "",
                    introduction: "",
                    sex: '',
                    sexStr: '',
                    status: '',
                    statusStr:''
                }
            }
        },
        methods: {
            show(param) {
                Object.assign(this,this.$options.data());
                this.id = param.id;
                this._onOk = param.onOk;
                this._onCancel = param.onCancel;
                this.visible = true;
                queryEduTeacherDetail({ id: this.id }).then((result) => {
                    result.createdTimeStr = formatTimeStr(result.createdTime, 'YYYY-MM-DD HH:mm:ss');
                    result.statusStr = BaseStatusEnum.toStr(result.status);
                    Object.assign(this.info, result);
                });
            },
            handleCancel() {
                this.visible = false;
                if (this._onCancel) this._onCancel();
            }
        }
    }
</script>